<style>
    .modal-body {max-height: 560px;overflow:hidden;padding: 15px 0 0 0}
    .wizard-nav {
        background: #f2f2f2;
        padding: 15px 0 13px;
        border-bottom: 1px solid #eee;
        margin-top: -15px;
    }
    ul, ol, ul li, ol li {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    .wizard-nav li {
        display: inline-block;
        width: 24%;
        text-align: center;
    }
    .wizard-nav li span {
        position: relative;
        display: block;
        margin: 3px auto;
        width: 36px;
        height: 36px;
        text-align: center;
        line-height: 27px;
        border-radius: 50%;
        background: #777;
        border: 4px solid #e2e2e2;
        color: #fff;
    }
    .wizard-nav li span hr {
        position: absolute;
        top: -11px;
        left: 28px;
        width: 188px;
        height: 8px;
        background: #e2e2e2;
        border: 0 none;
    }
    .wizard-nav li.current span {
        background-color: #386d39;
    }
    .steps{
        padding-top: 15px;
        width: 3614px;
        position: relative;
        left: 0px;
    }
    .steps .step{
        display: inline-block;
        width: 900px;
        vertical-align: top;
    }
    .btn-prev {
          background: #3b3f4e;
          float: left;
    }
    .btn-next {
        background: #3b3f4e;
        float: right;
    }
    .modal-footer {
        margin-bottom: -2px;
    }
    .hide{
        display: none;
    }
    .formInput{
        height: 380px;
        overflow-y: auto;
        overflow-x: hidden;
    }
</style>
<div class="modal-dialog modal-lg ">
    <div class="modal-content" id="modal-content-tpls">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <div class="modal-title" id="myModalLabel">
                客户信息注册
            </div>
        </div>
        <div class="modal-body">
            <ol class="wizard-nav">
                <li class="current step1">
                    客户基本信息
                    <span><hr>1
                    </span>
                </li>
                <li class="step2">
                    绑定账户信息
                    <span>
                        <hr>2
                    </span>
                </li>
                <li class="step3">
                    注册商户信息
                    <span>
                       <hr> 3
                    </span>
                </li>
                <li class="step4">
                    客户设备绑定
                    <span>
                        4
                    </span>
                </li>
            </ol>
            <div class="steps">
                <form id="validForm" method="post" action="#" class="form-horizontal layer_msg">
                    <div id="step1" class="step">
                            <div class="formInput">
                                <input type="hidden" class="form-control" id="PId" name="PId"/>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">证件类型</label>
                                    <div class="form-group  col-sm-4">
                                        <select class="form-control" data-field="CertifiType" id="CertifiType" name="CertifiType" required>
                                            <!--动态加载-->
                                        </select>
                                    </div>
                                    <label class="col-sm-2 control-label">证件号码</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" data-field="CertifiNo" id="CertifiNo" name="CertifiNo" required/>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label"></label>
                                    <div class="form-group col-sm-6">
                                        <button id="queryName" type="button" class="btn btn-primary">查 询</button>
                                        <span id="tiShi" class="hide">正在查询客户信息，请稍后………………</span>
                                    </div>
                                </div>
                                <div id="cusResp" class="hide">
                                    <div class="col-sm-12">
                                        <label class="col-sm-2 control-label">客户姓名</label>
                                        <div class="form-group col-sm-4">
                                            <input type="text" class="form-control" data-field="UseName" id="UseName" name="UseName" required />
                                        </div>
                                        <label class="col-sm-2 control-label">联系电话</label>
                                        <div class="form-group  col-sm-4">
                                            <input type="text" class="form-control" data-field="Phone" id="Phone" name="Phone" placeholder="手机/座机号码"  required />
                                        </div>
                                    </div>
                                    <div class="col-sm-12">
                                        <label class="col-sm-2 control-label">联系地址</label>
                                        <div class="form-group  col-sm-4" style="width: 696px;">
                                            <input type="text" class="form-control" data-field="Address" id="Address" name="Address" required/>
                                        </div>
                                    </div>
                                </div>

                            </div>

                            <div class="modal-footer" style="clear: both">
                                <button id="modal-btn-next1" type="button" class="btn btn-primary btn-next disabled">下一步</button>
                            </div>
                    </div>
                    <div id="step2" class="step">
                            <div class="formInput">
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">绑定账号</label>
                                    <div class="form-group  col-sm-4">
                                        <select class="form-control" id="cards">
                                            <!--动态加载-->
                                        </select>
                                    </div>
                                </div>
                                <div class="col-sm-12 hide">
                                    <label class="col-sm-2 control-label">新账号</label>
                                    <div class="form-group col-sm-4">
                                        <input type="text" class="form-control" id="CartNo" name="CartNo" required />
                                    </div>
                                </div>
                            </div>

                            <div class="modal-footer" style="clear: both">
                                <button id="modal-btn-prev0" type="button" class="btn btn-primary btn-prev">上一步</button> <button id="modal-btn-next2" type="button" class="btn btn-primary btn-next">下一步</button>
                            </div>
                    </div>
                    <div id="step3" class="step">
                            <div class="formInput">
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">是否开通跨行</label>
                                    <div class="form-group  col-sm-4">
                                        <div class="checkbox">
                                            <label>
                                                <input type="checkbox" id="croBank" checked="checked">
                                            </label>
                                        </div>
                                    </div>
                                </div>
                                <div  id="nr">
                                    <div class="col-sm-12">
                                        <label class="col-sm-2 control-label">商户信息</label>
                                        <div class="form-group  col-sm-4">
                                            <select class="form-control" id="merchants">
                                                <!--动态加载-->
                                            </select>
                                        </div>
                                    </div>
                                    <div id="nrr">
                                        <div class="col-sm-12">
                                            <label class="col-sm-2 control-label">商户名称</label>
                                            <div class="form-group  col-sm-4">
                                                <input type="hidden" class="form-control" id="MerchantId" name="MerchantId"/>
                                                <input type="text" class="form-control" id="MerchantName" name="MerchantName" required/>
                                            </div>
                                            <label class="col-sm-2 control-label">工商注册号</label>
                                            <div class="form-group col-sm-4">
                                                <input type="text" class="form-control" id="BusergNo" name="BusergNo" required />
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <label class="col-sm-2 control-label">税务登记号</label>
                                            <div class="form-group  col-sm-4">
                                                <input type="text" class="form-control" id="TaxergNo" name="TaxergNo"  required />
                                            </div>
                                        </div>
                                    </div>

                                </div>
                            </div>
                            <div class="modal-footer" style="clear: both">
                                <button id="modal-btn-prev1" type="button" class="btn btn-primary btn-prev">上一步</button>
                                <button id="modal-btn-next3" type="button" class="btn btn-primary btn-next">下一步</button>
                            </div>
                    </div>
                    <div id="step4" class="step">
                            <div class="formInput">
                                <div class="form-group col-sm-12 category">
                                    设备信息 :
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">设备编号</label>
                                    <div class="form-group col-sm-4">
                                        <input type="text" class="form-control" id="DeviceId" name="DeviceId" required />
                                    </div>
                                    <label class="col-sm-2 control-label">密码键盘编号</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" id="SafeDevId" name="SafeDevId"  required />
                                    </div>
                                </div>
                                <div class="col-sm-12 hide">
                                    <label class="col-sm-2 control-label">定位半径</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" data-field="Radius" id="Radius" name="Radius" value="1000" required/>
                                    </div>
                                    <label class="col-sm-2 control-label">锁屏时间</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" data-field="AppLockTime" id="AppLockTime" name="AppLockTime" value="300" required/>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">设备属组</label>
                                    <div class="form-group  col-sm-4">
                                        <select class="form-control" data-field="UserType" id="UserType" name="UserType" required>
                                            <!--动态加载-->
                                        </select>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">安装地址</label>
                                    <div class="form-group  col-sm-4" style="width: 682px;">
                                        <input type="text" class="form-control" id="InstallAddr" name="InstallAddr" required/>
                                    </div>
                                </div>

                                <div class="form-group col-sm-12 category">
                                    交易限额 :
                                </div>
                                <div class="col-sm-12" style="clear: both">
                                    <label class="col-sm-2 control-label">单笔</label>
                                    <div class="form-group col-sm-4">
                                        <input type="text" min="1" Class="form-control" id="CusLmtAmt" name="CusLmtAmt"   required/>
                                    </div>
                                    <label class="col-sm-2 control-label">日累计</label>
                                    <div class="form-group col-sm-4">
                                        <input type="text" min="1" class="form-control" id="CusLmtAmtDay" name="CusLmtAmtDay" required/>
                                    </div>
                                </div>
                                <div class="col-sm-12 kh">
                                    <label class="col-sm-2 control-label">单笔跨行</label>
                                    <div class="col-sm-4 form-group">
                                        <input type="text" min="1" class="form-control" id="CusOtherLmtAmt" name="CusOtherLmtAmt"  required/>
                                    </div>
                                    <label class="col-sm-2 control-label">日累计跨行</label>
                                    <div class="col-sm-4 form-group">
                                        <input type="text" min="1" class="form-control" id="CusOtherLmtAmtDay" name="CusOtherLmtAmtDay" required/>
                                    </div>
                                </div>
                                <div class="form-group col-sm-12 category">
                                    手续费设置 :
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">手续费收费类型</label>
                                    <div class="form-group col-sm-4">
                                        <select class="form-control" data-field="FeeCharge" id="FeeCharge" name="FeeCharge" required>
                                            <option value="">请选择</option>
                                            <option value="01">按笔收</option>
                                            <option value="02">按金额</option>
                                        </select>
                                    </div>
                                    <label class="col-sm-2 control-label">手续费</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" min="0" class="form-control" data-field="FeeFixedAmt" id="FeeFixedAmt" name="FeeFixedAmt" required/>
                                    </div>
                                </div>

                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">本行折扣率</label>
                                    <div class="form-group col-sm-4">
                                        <input type="text" min="0" max="1" class="form-control" data-field="ABCCardFee" id="ABCCardFee" name="ABCCardFee" required/>
                                    </div>
                                    <label class="col-sm-2 control-label">手续费支付方</label>
                                    <div class="form-group col-sm-4">
                                        <select class="form-control" id="PayType" name="PayType" required>
                                            <option value="">请选择</option>
                                            <option value="0">转入方</option>
                                            <option value="1">转出方</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label kh">跨行手续费</label>
                                    <div class="form-group  col-sm-4 kh">
                                        <select class="form-control" data-field="OtherCardFee" id="OtherCardFee" name="OtherCardFee" required>
                                            <option value="">请选择</option>
                                            <option value="0">免费</option>
                                            <option value="1">收费</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group col-sm-12 category">
                                    其他 :
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">客户经理姓名</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" data-field="ManagerName" id="ManagerName" name="ManagerName"/>
                                    </div>
                                    <label class="col-sm-2 control-label">客户经理代码</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" data-field="ManagerId" id="ManagerId" name="ManagerId"/>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <label class="col-sm-2 control-label">客户经理电话</label>
                                    <div class="form-group  col-sm-4">
                                        <input type="text" class="form-control" data-field="ManagerCont" id="ManagerCont" name="ManagerCont"/>
                                    </div>
                                </div>

                            </div>
                            <div class="modal-footer" style="clear: both">
                                <button id="modal-btn-prev2" type="button" class="btn btn-primary btn-prev">上一步</button>
                                <button id="modal-btn-finish" type="submit" class="btn btn-primary btn-finish">设备绑定</button>
                            </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
